{% extends "../_base/layout.html" %} 
{% block css %}
<link rel="stylesheet" href="{{site.static}}/css/service_reply_detail.css"> 
{% endblock %} 
{% block content %} 
    {% block header%} 
        {% set pageHeaderConf = {pageTitle: __("service_reply_detail_page_title"),level:2} %} 
        {%include "../_base/page_header.html"%} 
    {% endblock %}
<div class="eui-main-container eui--padding-b-0 reply-detail-main-container">
    <div class="eui-card eui--white-bacg question-list eui--margin-t-20">
        <div class="eui-card-header">{{__("service_reply_detail_card_title")}}</div>
        <div class="eui-card-content eui--margin-x-16">
            <div class="question-progress-wrap eui--position-rel">
                <ul class="question-progress eui--text-center">
                    <li class="question-progress-item eui--display-i-b eui--position-rel">
                        <div class="progress-point eui--position-rel active"></div>
                        <p class="eui--949494-color eui--font-26">{{__("service_reply_detail_progress_1")}}</p>
                    </li>
                    <li class="question-progress-item eui--display-i-b eui--position-rel">
                        <div class="progress-point eui--position-rel active"></div>
                        <p class="eui--949494-color eui--font-26">{{__("service_reply_detail_progress_2")}}</p>
                    </li>
                    <li class="question-progress-item eui--display-i-b eui--position-rel">
                        <div class="progress-point eui--position-rel"></div>
                        <p class="eui--949494-color eui--font-26">{{__("service_reply_detail_progress_3")}}</p>
                    </li>
                </ul>
            </div>
            <ul class="eui-table-view reply-detail-list eui--clearfix">
                <li class="eui-table-view-cell eui--clearfix eui--pull-right reply-user">
                    <img class="question-avatar eui--pull-right" src="{{site.cdn}}/customer/user-question-avatar.png" alt="">                                        
                    <div class="eui-media eui--pull-right">
                        <p class="eui-media-label eui--556496-color eui--font-32 eui--text-r">昵称</p>
                        <div class="eui-media-body eui--white-color eui--font-26 eui--margin-t-20 eui--position-rel">
                            亲爱的玩家，您好，您的问题我们正在处理中。
                        </div>                            
                    </div>
                </li>
                <li class="eui-table-view-cell eui--clearfix eui--pull-left official-customer">
                    <img class="question-avatar eui--pull-left" src="{{site.cdn}}/customer/user-question-avatar.png" alt="">                                        
                    <div class="eui-media eui--pull-left">
                        <p class="eui-media-label eui--556496-color eui--font-32">昵称</p>
                        <div class="eui-media-body eui--black-color eui--font-26 eui--margin-t-20 eui--position-rel">
                            亲爱的玩家，您好，您的问题我们正在处理中。
                        </div>   
                        <div class="eui-media-footer">
                            <p class="eui--font-24 eui--949494-color">{{__("service_reply_detail_page_tips")}}</p>
                            <div class="star-list">
                                <span class="eui-icon eui-icon-star active"></span>
                                <span class="eui-icon eui-icon-star active"></span>
                                <span class="eui-icon eui-icon-star"></span>
                                <span class="eui-icon eui-icon-star"></span>
                                <span class="eui-icon eui-icon-star"></span>                                                
                            </div>    
                        </div>                         
                    </div>
                    
                </li>
                 <li class="eui-table-view-cell eui--clearfix eui--pull-right reply-user">
                    <img class="question-avatar eui--pull-right" src="{{site.cdn}}/customer/user-question-avatar.png" alt="">                                        
                    <div class="eui-media eui--pull-right">
                        <p class="eui-media-label eui--556496-color eui--font-32 eui--text-r">昵称</p>
                        <div class="eui-media-body eui--white-color eui--font-26 eui--margin-t-20 eui--position-rel">
                            亲爱的玩家，您好，您的问题我们正在处理中。
                        </div>  
                        <div class="question-img-list">
                            <img src="{{site.cdn}}/test-question-img-01.jpg" alt="">
                            <img src="{{site.cdn}}/test-question-img-02.jpg" alt="">
                            <img src="{{site.cdn}}/test-question-img-02.jpg" alt="" class="eui--margin-r-0">                            
                        </div>                          
                    </div>
                </li>
            </ul>
        </div>
        <div class="eui-card-footer solved-footer eui--text-center eui--949494-color eui--font-26">
            {{__("service_reply_detail_page_tips_1")}}<a href="" class="eui--e51c24-color">{{__("service_reply_detail_page_tips_2")}}</a>
        </div>
        
        <div class="eui-card-footer eui--hide">
            <form class="eui-form">
                <div class="eui-form-control">
                    <textarea class="eui-textarea" rows="" cols="" placeholder="" value="">{{__("service_human_question_desc_input_tips")}}</textarea>
                    <span class="word-num eui--font-24">0/1500</span>
                </div>
                <div class="eui-form-control eui--clearfix">                    
                    <div class="preview-img-wrap">
                        <div class="preload-img delete-btn"></div>
                        <img src="http://172.16.60.230:35101/static/images/test-question-img-01.jpg" alt="" class="preview-img">
                    </div>
                    <div class="preview-img-wrap">
                        <div class="preload-img delete-btn"></div>
                        <img src="http://172.16.60.230:35101/static/images/test-question-img-02.jpg" alt="" class="preview-img">
                    </div>
                    <div class="preview-img-wrap">
                        <div class="preload-img"></div>
                        <img src="" alt="" class="preview-img">
                    </div>
                </div>
                <a href="javascript" class="eui-btn eui-btn-lg eui-btn-primary">{{__("btn_submit")}}</a>
            </form>
        </div>
    </div>
</div>
{% endblock %}
